/**
* @description:  运维审批首页
* @author: JiWei
* @date:
**/
<template>
	<view class="content">
		<view class="nav">
      <view class="left-title">
        <van-icon name="arrow-left" @click="exitBtn" style="margin-right: 4px;vertical-align: middle;"/>
        首页
      </view>
		</view>
    <view class="header-bar"></view>
	<view class="entry-list">
		<view v-for="(item,index) in newList" :key="index"  class="menu">
			<view class="module_title">{{ item.modelTypeName }}</view>
			<ul class="module-list">
				<li
					v-for="(modelItem,modelIndex) in item.model"
					:key="modelIndex"
					@click="chooseMenu(modelItem,modelIndex)"
					:class="{large:modelItem.MODEL_NAME.length>8}">
					<img :src="require(`../../../static/img/${modelItem.ICON_URL}`)">
					<text class="title-menu">{{ modelItem.MODEL_NAME }}</text>
				</li>
			</ul>
		</view>
	</view>
    <tabBar :current="bottomTab" :list="list"></tabBar>
	</view>
</template>
<script>
import {mapGetters, mapMutations} from 'vuex'
import tabBar from '../../../components/common/tabBar'
import baseConfig from "../../../common/config";
export default {
  name: 'index',
  components: { tabBar },
  props: {},
  data() {
    return {
      bottomTab:0,
	  newList:[],
      list:[
        {
          text: "首页", // 页面标题
          icon: require("../../../static/img/noSelectHome.png"), //未选中图标
          icon_a: require("../../../static/img/selectHome.png"), //选中图片
          path: "/pages/operationApprove/index/index",
        },
        {
          text: "我的",
          icon: require("../../../static/img/noSelectMine.png"),
          icon_a: require("../../../static/img/selectMine.png"),
          path: "/pages/operationApprove/mine/mine",
        },
      ],
      provinceList: [
        {
          imgUrl: require('../../../static/img/selectAll.png'),
          title:'印章使用工单审批',
          auth: ["AUTH"],
        },
        {
          imgUrl: require('../../../static/img/xsrw.png'),
          title:'工单记录',
          auth: ["AUTH"],
        },
    ],
      personList:[
        {
          imgUrl: require('../../../static/img/jfcrgd_sy.png'),
          title:'机房出入工单',
          auth: ["TEAM_MEMBER",'TEAM_LEADER'],
        },
        {
          imgUrl: require('../../../static/img/wgcrgd_sy.png'),
          title:'网管出入工单',
          auth: ["TEAM_MEMBER",'TEAM_LEADER'],
        },
        {
          imgUrl: require('../../../static/img/wgxsxjgd_sy.png'),
          title:'网管巡视巡检工单',
          auth: ["TEAM_MEMBER"],
        },
        {
          imgUrl: require('../../../static/img/wgxsxjgd_sy.png'),
          title:'网管巡视巡检工单',
          auth: ["TEAM_LEADER"],
        },
        {
          imgUrl: require('../../../static/img/yzsygd_sy.png'),
          title:'印章使用工单',
          auth: ["TEAM_MEMBER",'TEAM_LEADER'],
        },
        {
          imgUrl: require('../../../static/img/dbspgd_sy.png'),
          title:'待办工单',
          auth: ["TEAM_MEMBER",'TEAM_LEADER'],
        },
      ],
	};
  },
  computed: {
	  ...mapGetters(['userData','ywRoleAuth']),
  },
  watch: {

  },
  onLoad() {
    this.userDataSet(this.userData);
	  this.getModuleList()
	  
  },
  mounted() {
  },
  methods: {
    ...mapMutations(["userDataSet",'setApprove']),
	getModuleList(){
		  
		let params = {
			userId:this.userData.USERID
		}
		this.$api.getModuleList(params).then((res) => {
		    
		  this.newList = res.data
		    
		  if(res.data[0].modelTypeName=="工单申请"){
			  this.setApprove(res.data[0].model[2].APPROVE_ID)
		  }
		  
		})
		  

	},
	
    chooseMenu(item) {
      // if(item.auth[0] === 'TEAM_MEMBER') {
      //     uni.navigateTo({
      //       url: '/pages/operationApprove/communicationNetWorkMember/communicationNetWorkMember'
      //     })
      // }else {
      //   uni.navigateTo({
      //     url: '/pages/operationApprove/communicationNetWorkPerson/communicationNetWorkPerson'
      //   })
      // }
      switch(item.MODEL_NAME) {
		  case '机房出入工单':{
			  uni.navigateTo({
			    url: '/pages/operationApprove/communicationApproval/initiateApplication'
			  })
			  break;
		  };
		  case '网管室出入登记':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationNetWork/initiateApplication'
			  })
			  break;
		  };
		  case '印章使用工单':{
			  uni.navigateTo({
				url: '/pages/operationApprove/sealApproval/initiateApplication'
			  })
			  break;
		  };
		  case '机房出入工单列表':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationApproval/communicationApproval'
			  })
			  break;
		  };
		  case '网管室出入登记列表':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationNetWork/communicationNetWork'
			  })
			  break;
		  };
		  case '网管巡视工单列表':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationNetWorkMember/communicationNetWorkMemberList'
			  })
			  break;
		  };
		  case '印章使用工单列表':{
			  uni.navigateTo({
				url: '/pages/operationApprove/sealApproval/sealApprovalTeam'
			  })
			  break;
		  };
		  case '机房出入工单待办':{
			  uni.navigateTo({
				url: '/pages/operationApprove/todoOrder/todoOrder?id=1'
			  })
			  break;
		  };
		  case '网管室出入登记表审核':{
			  uni.navigateTo({
				url: '/pages/operationApprove/todoOrder/todoOrder?id=2'
			  })
			  break;
		  };  
		  case '网管室巡视工单分配':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationNetWorkPerson/communicationNetWorkPerson'
			  })
			  break;
		  };
		  case '网管巡视工单待办':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationNetWorkMember/communicationNetWorkMember'
			  })
			  break;
		  };
		  case '网管巡视工单审核':{
			  uni.navigateTo({
				url: '/pages/operationApprove/communicationToExam/communicationToExam'
			  })
			  break;
		  };
		  case '印章使用工单审批':{
			  uni.navigateTo({
				url: '/pages/operationApprove/todoOrder/todoOrder?id=4'
			  })
			  break;
		  };
		  case '机房出入工单记录':{
			  uni.navigateTo({
				url: "/pages/operationApprove/workOrderRecord/workOrderRecord?type=1"
			  })
			  break;
		  };
		  case '网管室出入登记记录':{
			  uni.navigateTo({
				url: '/pages/operationApprove/workOrderRecord/workOrderRecord?type=2'
			  })
			  break;
		  };
		  case '网管室巡视工单记录':{
			  uni.navigateTo({
				url: '/pages/operationApprove/workOrderRecord/workOrderRecord?type=3'
			  })
			  break;
		  };
		  case '印章使用工单记录':{
			  uni.navigateTo({
				url: '/pages/operationApprove/workOrderRecord/workOrderRecord?type=4'
			  })
			  break;
		  };
		  
        
      }
    },
    exitBtn() {
      baseConfig.actions.exitIgw();
    }
  }
};
</script>
<style scoped lang="scss">
.content {
  width: 100vw;
  height: 100vh;
  background: #F2F6FA;
  overflow: hidden;
  .nav {
    width: 100vw;
    height: px2vh(163);
    background: #417ADC;
    position: relative;
    .left-title {
      float: left;
      margin-left: px2vw(40);
      padding-top: px2vh(75);
      font-weight: bold;
      line-height: px2vh(50);
      height: px2vh(54);
      font-size: px2vh(54);
      color: #fff;
      img {
        width: px2vw(44);
        height: px2vh(28);
        vertical-align: middle;
      }
    }
  }
  .header-bar {
    width: 100vw;
    height: px2vh(150);
    border-radius: 0 0 px2vw(40) px2vw(40);
    background: #417ADC;
    // margin-bottom: px2vh(230);
	
  }
  .entry-list{
	width: 100vw;
  	height: calc(100vh - #{px2vh(300)});
  	overflow-y: scroll;
	margin-top: px2vh(-150);
  }
  .menu {
    width: px2vw(1020);
    height: px2vh(430);
    margin-left: px2vw(30);
    margin-bottom: px2vh(30);
    // background-image: url('../../../static/img/ywborder.png');
    background-color: #fff;
    border-radius: px2vh(20);
    overflow: hidden;
    background-size: cover;
    .module_title{
  	   margin-left: px2vw(40);
  	   margin-top: px2vh(40);
  	   margin-bottom: px2vh(49);
    }
	.module-list{
		display: flex;
		// margin: 0 px2vw(30);
	}
    li.large{
  	  width: calc(1 * (100% - #{px2vw(250)}) / 4);
  	  margin-left: px2vw(60);
    }
    li {
		// flex:1;
		fflex-shrink: 0;
      width: calc(1 * (100% - #{px2vw(350)}) / 4);
      height: px2vh(430);
  	// height: auto;
      margin-left: px2vw(70);
      float: left;
      position: relative;
      text-align: center;
      img {
        width: px2vw(146);
        height: px2vw(146);
  	  display: block;
  	  margin: 0 auto;
        // margin-bottom: px2vh(5);
      }
      .title-menu {
        font-size: px2vw(36);
        color: #333;
      }
      .todoNum {
        display: inline-block;
        width: px2vw(40);
        height: px2vw(40);
        background: #f00;
        font-size: px2vw(30);
        color:#fff;
        text-align: center;
        border-radius: 100%;
        position: absolute;
        top: px2vh(50);
        left: px2vh(100);
      }
    }
  }
}
</style>
